<template>
  <div>
    <Loading :loading="loading">
      <van-form ref="userInfoForm">
        <div class="c-hi306n">
          <!-- 投保人信息 -->
          <div class="c-91t2s9">
            <div class="c-91t2s9-title">投保人信息</div>
            <div class="c-91t2s9-list">
              <div class="c-91t2s9-list-item">
                <div class="c-8moxqg flex-row flex-align-center">
                  <span class="c-8moxqg-item-star">*</span>
                  <div class="c-8moxqg-item-label">姓名</div>
                  <div class="c-8moxqg-item-value">
                    <van-field
                      class="c-8moxqg-item-value-text"
                      v-model="appPolicyHolderInfo.name"
                      name="name"
                      :rules="formRules.nameRules"
                    ></van-field>
                  </div>
                  <img
                    class="c-8moxqg-item-img"
                    src="./img/doc.png"
                    @click="
                      $refs.peoName.visible = true
                      $refs.peoName.value = appPolicyHolderInfo.name
                    "
                  />
                  <PeoList
                    ref="peoName"
                    @confirm="
                      value => handlePeopleSelect(value, 'appPolicyHolderInfo')
                    "
                    :columns="peopleList"
                  />
                </div>
              </div>

              <div class="c-91t2s9-list-item">
                <div class="c-8moxqg flex-row flex-align-center">
                  <span class="c-8moxqg-item-star">*</span>
                  <div class="c-8moxqg-item-label">证件类型</div>
                  <div class="c-8moxqg-item-value">
                    <van-field
                      class="c-8moxqg-item-value-text"
                      :value="appPolicyHolderInfo.idType"
                      name="idType"
                      @click="handleVisible('idType')"
                      :rules="
                        appPolicyHolderInfo.idType == 1
                          ? formRules.cardTypeRules
                          : formRules.noEmptyRules
                      "
                    >
                      <template #input>
                        <PeoInsured
                          ref="idType"
                          title="证件类型"
                          @confirm="
                            value =>
                              handleConfirm(
                                value,
                                'idType',
                                'appPolicyHolderInfo'
                              )
                          "
                          placeholder="请选择证件类型"
                          :defaultValue="appPolicyHolderInfo.idType"
                          :columns="cardList"
                        />
                      </template>
                    </van-field>
                  </div>
                  <van-icon name="arrow" class="c-8moxqg-item-left" />
                </div>
              </div>
              <div class="c-91t2s9-list-item">
                <div class="c-8moxqg flex-row flex-align-center">
                  <span class="c-8moxqg-item-star">*</span>
                  <div class="c-8moxqg-item-label">证件号码</div>
                  <div class="c-8moxqg-item-value">
                    <van-field
                      class="c-8moxqg-item-value-text"
                      v-model="appPolicyHolderInfo.idNo"
                      name="idNo"
                      :rules="formRules.cardNoeRules"
                      @blur="
                        checkappPolicyHolderInfoIdNO(appPolicyHolderInfo.idNo)
                      "
                    ></van-field>
                  </div>
                  <div
                    class="flex-row flex-align-center"
                    @click="
                      handleGoToScan(
                        'card',
                        'idNo',
                        PEOPLE_TYPE.POLICT_HOLDER,
                        'appPolicyHolderInfo'
                      )
                    "
                  >
                    <van-icon class="c-8moxqg-item-scan" name="scan" />
                    <span class="c-8moxqg-item-img-text">扫描</span>
                  </div>
                </div>
              </div>

              <div class="c-91t2s9-list-item">
                <div class="c-8moxqg flex-row flex-align-center">
                  <span class="c-8moxqg-item-star">*</span>
                  <div class="c-8moxqg-item-label">性别</div>
                  <div class="c-8moxqg-item-value">
                    <van-field
                      class="c-8moxqg-item-value-text"
                      :value="appPolicyHolderInfo.sex"
                      name="sex"
                      @click="handleVisible('sexType')"
                      :rules="formRules.sexTypeRules"
                    >
                      <template #input>
                        <PeoInsured
                          ref="sexType"
                          title="性别"
                          @confirm="
                            value =>
                              handleConfirm(value, 'sex', 'appPolicyHolderInfo')
                          "
                          placeholder="请选择性别"
                          :defaultValue="appPolicyHolderInfo.sex"
                          :columns="sexList"
                        />
                      </template>
                    </van-field>
                  </div>
                  <van-icon name="arrow" class="c-8moxqg-item-left" />
                </div>
              </div>
              <div class="c-91t2s9-list-item">
                <div class="c-8moxqg flex-row flex-align-center">
                  <span class="c-8moxqg-item-star">*</span>
                  <div class="c-8moxqg-item-label">出生日期</div>
                  <div class="c-8moxqg-item-value">
                    <van-field
                      class="c-8moxqg-item-value-text"
                      :value="appPolicyHolderInfo.birthday"
                      name="birthday"
                      @click="handleVisible('birthdayTyp')"
                      :rules="formRules.birthdayTypeRules"
                    >
                      <template #input>
                        <PeoBirthday
                          ref="birthdayTyp"
                          title="选择年月日"
                          @confirm="
                            value =>
                              handleConfirm(
                                value,
                                'birthday',
                                'appPolicyHolderInfo'
                              )
                          "
                          placeholder="请输入出生日期"
                          :defaultValue="appPolicyHolderInfo.birthday"
                        />
                      </template>
                    </van-field>
                  </div>
                  <van-icon name="arrow" class="c-8moxqg-item-left" />
                </div>
              </div>

              <div class="c-91t2s9-list-item">
                <div class="c-8moxqg flex-row flex-align-center">
                  <span class="c-8moxqg-item-star">*</span>
                  <div class="c-8moxqg-item-label">证件是否长期有效</div>
                  <div class="c-8moxqg-item-value c-8moxqg-item-margin-left">
                    <van-radio-group
                      class="c-8moxqg-item-value-text"
                      v-model="appPolicyHolderInfo.isIdLongTerm"
                      name="isIdLongTerm"
                      direction="horizontal"
                    >
                      <van-radio name="Y">是</van-radio>
                      <van-radio name="N">否</van-radio>
                    </van-radio-group>
                  </div>
                </div>
              </div>
              <div
                class="c-91t2s9-list-item"
                v-if="appPolicyHolderInfo.isIdLongTerm === 'N'"
              >
                <div class="c-8moxqg flex-row flex-align-center">
                  <span class="c-8moxqg-item-star">*</span>
                  <div class="c-8moxqg-item-label">证件有效期止期</div>
                  <div class="c-8moxqg-item-value">
                    <van-field
                      class="c-8moxqg-item-value-text"
                      :value="appPolicyHolderInfo.idEndDate"
                      name="idEndDate"
                      @click="handleVisible('idEndDateTyp')"
                      :rules="formRules.idEndDateTypeRules"
                    >
                      <template #input>
                        <PeoBirthday
                          ref="idEndDateTyp"
                          title="选择年月日"
                          @confirm="
                            value =>
                              handleConfirm(
                                value,
                                'idEndDate',
                                'appPolicyHolderInfo'
                              )
                          "
                          placeholder="请输入证件有效期止期	"
                          :defaultValue="appPolicyHolderInfo.idEndDate"
                        />
                      </template>
                    </van-field>
                  </div>
                  <van-icon name="arrow" class="c-8moxqg-item-left" />
                </div>
              </div>

              <div class="c-91t2s9-list-item">
                <div class="c-8moxqg flex-row flex-align-center">
                  <span class="c-8moxqg-item-star">*</span>
                  <div class="c-8moxqg-item-label">手机号码</div>
                  <div class="c-8moxqg-item-value">
                    <van-field
                      class="c-8moxqg-item-value-text"
                      v-model="appPolicyHolderInfo.mobile"
                      name="mobile"
                      placeholder="请输入手机号"
                      :rules="formRules.mobileRules"
                    ></van-field>
                  </div>
                </div>
              </div>

              <div class="c-91t2s9-list-item">
                <div class="c-8moxqg flex-row flex-align-center">
                  <span class="c-8moxqg-item-star">*</span>
                  <div class="c-8moxqg-item-label">所在地区</div>
                  <div class="c-8moxqg-item-value">
                    <van-field
                      class="c-8moxqg-item-value-text"
                      name="area"
                      @click="handleVisible('area')"
                      :rules="formRules.areaeRules"
                    >
                      <template #input>
                        <PeoArea
                          ref="area"
                          @confirm="
                            value =>
                              handleConfirm(
                                value,
                                'area',
                                'appPolicyHolderInfo'
                              )
                          "
                          placeholder="请选择所在地区"
                          :areaList="areaList"
                          :defaultValue="appPolicyHolderInfo.area"
                          :value="appPolicyHolderInfo.area"
                        />
                      </template>
                    </van-field>
                  </div>
                  <van-icon name="arrow" class="c-8moxqg-item-left" />
                </div>
              </div>
              <div class="c-91t2s9-list-item">
                <div class="c-8moxqg flex-row flex-align-center">
                  <span class="c-8moxqg-item-star">*</span>
                  <div class="c-8moxqg-item-label">详细地区</div>
                  <div class="c-8moxqg-item-value">
                    <van-field
                      type="textarea"
                      rows="1"
                      autosize
                      class="c-8moxqg-item-value-text"
                      v-model="appPolicyHolderInfo.street"
                      name="street"
                      placeholder="例：学院路37号1号楼109室"
                      :rules="formRules.streetRules"
                    ></van-field>
                  </div>
                </div>
              </div>
              <div class="c-91t2s9-list-item">
                <div class="c-8moxqg flex-row flex-align-center">
                  <span class="c-8moxqg-item-star">*</span>
                  <div class="c-8moxqg-item-label">电子邮箱</div>
                  <div class="c-8moxqg-item-value">
                    <van-field
                      class="c-8moxqg-item-value-text"
                      v-model="appPolicyHolderInfo.email"
                      name="email"
                      :rules="formRules.emailRules"
                    ></van-field>
                  </div>
                </div>
              </div>

              <div class="c-91t2s9-list-item">
                <div class="c-8moxqg flex-row flex-align-center">
                  <span class="c-8moxqg-item-star">*</span>
                  <div class="c-8moxqg-item-label">开户银行</div>
                  <div class="c-8moxqg-item-value">
                    <van-field
                      class="c-8moxqg-item-value-text"
                      :value="appPolicyHolderInfo.bankId"
                      name="bankId"
                      :rules="formRules.bankTypeRules"
                      @click="handleVisible('bankType')"
                    >
                      <template #input>
                        <PeoInsured
                          ref="bankType"
                          title="开户银行"
                          @confirm="
                            value =>
                              handleConfirm(
                                value,
                                'bankId',
                                'appPolicyHolderInfo'
                              )
                          "
                          placeholder="请选择开户银行"
                          :defaultValue="appPolicyHolderInfo.bankId"
                          :columns="bankList"
                        />
                      </template>
                    </van-field>
                  </div>
                  <van-icon name="arrow" class="c-8moxqg-item-left" />
                </div>
              </div>
              <!-- 分支行 -->
              <div class="c-91t2s9-list-item">
                <div class="c-8moxqg flex-row flex-align-center">
                  <div class="c-8moxqg-item-label">分支行</div>
                  <div class="c-8moxqg-item-value">
                    <van-field
                      class="c-8moxqg-item-value-text"
                      v-model="appPolicyHolderInfo.branchBankName"
                      name="branchBankName"
                    ></van-field>
                  </div>
                </div>
              </div>

              <div class="c-91t2s9-list-item">
                <div class="c-8moxqg flex-row flex-align-center">
                  <span class="c-8moxqg-item-star">*</span>
                  <div class="c-8moxqg-item-label">银行卡号</div>
                  <div class="c-8moxqg-item-value">
                    <van-field
                      class="c-8moxqg-item-value-text"
                      v-model="appPolicyHolderInfo.cardNo"
                      name="cardNo"
                      :rules="formRules.bankNoRules"
                    ></van-field>
                  </div>
                  <div
                    class="flex-row flex-align-center"
                    @click="
                      handleGoToScan(
                        'bank',
                        'cardNo',
                        PEOPLE_TYPE.POLICT_HOLDER,
                        'appPolicyHolderInfo'
                      )
                    "
                  >
                    <van-icon class="c-8moxqg-item-scan" name="scan" />
                    <span class="c-8moxqg-item-img-text">扫描</span>
                  </div>
                </div>
              </div>

              <!-- <div class="c-91t2s9-list-item">
                <div class="c-8moxqg flex-row flex-align-center">
                  <div class="c-8moxqg-item-label">备注</div>
                  <div class="c-8moxqg-item-value">
                    <van-field
                      class="c-8moxqg-item-value-text"
                      v-model="appPolicyHolderInfo.remarks"
                      name="remarks"
                    ></van-field>
                  </div>
                </div>
              </div> -->
            </div>
          </div>
          <!-- 被保人信息 -->
          <div class="c-91t2s9">
            <div
              class="c-91t2s9-title flex-row flex-align-center flex-justify-between"
            >
              <div>被保险人信息</div>
              <div
                class="c-91t2s9-title-plus flex-row flex-align-center"
                @click="addPolicyInsuredInfo()"
              >
                <van-icon name="plus" />
                <span>新增</span>
              </div>
            </div>
            <div
              class="c-91t2s9-list"
              v-for="(item, index) in appPolicyInsuredList"
              :key="index"
            >
              <div class="c-91t2s9-list-title">
                <div
                  class="c-91t2s9-list-del flex-row flex-align-center"
                  @click="delList(index, appPolicyInsuredList)"
                >
                  <span>删除</span>
                  <van-icon name="delete-o" />
                </div>
              </div>
              <div class="c-91t2s9-list-item">
                <div class="c-8moxqg flex-row flex-align-center">
                  <span class="c-8moxqg-item-star">*</span>
                  <div class="c-8moxqg-item-label">投保人的</div>
                  <div class="c-8moxqg-item-value">
                    <van-field
                      class="c-8moxqg-item-value-text"
                      :value="item.relationType"
                      name="relationType"
                      :rules="formRules.relationTypeRules"
                      @click="handleVisible('relationType', index)"
                    >
                      <template #input>
                        <PeoInsured
                          ref="relationType"
                          title="是投保人的"
                          @confirm="
                            value =>
                              handleConfirm(
                                value,
                                'relationType',
                                'appPolicyInsuredList',
                                index
                              )
                          "
                          placeholder="投保人的"
                          :defaultValue="item.relationType"
                          :columns="relationList"
                        />
                      </template>
                    </van-field>
                  </div>
                  <van-icon name="arrow" class="c-8moxqg-item-left" />
                </div>
              </div>
              <div v-if="item.relationType !== '00'">
                <div class="c-91t2s9-list-item">
                  <div class="c-8moxqg flex-row flex-align-center">
                    <span class="c-8moxqg-item-star">*</span>
                    <div class="c-8moxqg-item-label">姓名</div>
                    <div class="c-8moxqg-item-value">
                      <van-field
                        class="c-8moxqg-item-value-text"
                        v-model="item.name"
                        name="name"
                        :rules="formRules.nameRules"
                      ></van-field>
                    </div>
                    <img
                      class="c-8moxqg-item-img"
                      src="./img/doc.png"
                      @click="
                        handleVisible('bepeoName' + index, 0)
                        $refs['bepeoName' + index][0].value = item.name
                      "
                    />
                    <PeoList
                      :ref="'bepeoName' + index"
                      @confirm="
                        value =>
                          handlePeopleSelect(value, appPolicyInsuredList, index)
                      "
                      :columns="peopleList"
                    />
                  </div>
                </div>

                <div class="c-91t2s9-list-item">
                  <div class="c-8moxqg flex-row flex-align-center">
                    <span class="c-8moxqg-item-star">*</span>
                    <div class="c-8moxqg-item-label">证件类型</div>
                    <div class="c-8moxqg-item-value">
                      <!-- :rules="formRules.beCardTypeRules" -->
                      <van-field
                        class="c-8moxqg-item-value-text"
                        :value="item.idType"
                        name="idType"
                        :rules="
                          appPolicyHolderInfo.idType == 1
                            ? formRules.cardTypeRules
                            : formRules.noEmptyRules
                        "
                        @click="handleVisible('beCardType' + index, 0)"
                      >
                        <template #input>
                          <PeoInsured
                            :ref="'beCardType' + index"
                            title="证件类型"
                            @confirm="
                              value =>
                                handleConfirm(
                                  value,
                                  'idType',
                                  'appPolicyInsuredList',
                                  index
                                )
                            "
                            placeholder="请输入证件类型"
                            :defaultValue="item.idType"
                            :columns="cardList"
                          />
                        </template>
                      </van-field>
                    </div>
                    <van-icon name="arrow" class="c-8moxqg-item-left" />
                  </div>
                </div>
                <div class="c-91t2s9-list-item">
                  <div class="c-8moxqg flex-row flex-align-center">
                    <span class="c-8moxqg-item-star">*</span>
                    <div class="c-8moxqg-item-label">证件号码</div>
                    <div class="c-8moxqg-item-value">
                      <van-field
                        class="c-8moxqg-item-value-text"
                        v-model="item.idNo"
                        name="idNo"
                        :rules="formRules.beCardNoRules"
                        @blur="checkappPolicyInsuredListIdNO(item.idNo, index)"
                      ></van-field>
                    </div>
                    <div
                      class="flex-row flex-align-center"
                      @click="
                        handleGoToScan(
                          'card',
                          'idNo',
                          PEOPLE_TYPE.POLICT_INSURED,
                          'appPolicyInsuredList',
                          index
                        )
                      "
                    >
                      <van-icon class="c-8moxqg-item-scan" name="scan" />
                      <span class="c-8moxqg-item-img-text">扫描</span>
                    </div>
                  </div>
                </div>
                <div class="c-91t2s9-list-item">
                  <div class="c-8moxqg flex-row flex-align-center">
                    <span class="c-8moxqg-item-star">*</span>
                    <div class="c-8moxqg-item-label">性别</div>
                    <div class="c-8moxqg-item-value">
                      <van-field
                        class="c-8moxqg-item-value-text"
                        :value="item.sex"
                        name="sex"
                        @click="handleVisible('sexTypeInsured' + index, 0)"
                        :rules="formRules.sexTypeRules"
                      >
                        <template #input>
                          <PeoInsured
                            :ref="'sexTypeInsured' + index"
                            title="性别"
                            @confirm="
                              value =>
                                handleConfirm(
                                  value,
                                  'sex',
                                  'appPolicyInsuredList',
                                  index
                                )
                            "
                            placeholder="请选择性别"
                            :defaultValue="item.sex"
                            :columns="sexList"
                          />
                        </template>
                      </van-field>
                    </div>
                    <van-icon name="arrow" class="c-8moxqg-item-left" />
                  </div>
                </div>
                <div class="c-91t2s9-list-item">
                  <div class="c-8moxqg flex-row flex-align-center">
                    <span class="c-8moxqg-item-star">*</span>
                    <div class="c-8moxqg-item-label">出生日期</div>
                    <div class="c-8moxqg-item-value">
                      <van-field
                        class="c-8moxqg-item-value-text"
                        :value="item.birthday"
                        name="birthday"
                        @click="handleVisible('birthdayTypInsured' + index, 0)"
                        :rules="formRules.birthdayTypeRules"
                      >
                        <template #input>
                          <PeoBirthday
                            :ref="'birthdayTypInsured' + index"
                            title="选择年月日"
                            @confirm="
                              value =>
                                handleConfirm(
                                  value,
                                  'birthday',
                                  'appPolicyInsuredList',
                                  index
                                )
                            "
                            placeholder="请输入出生日期"
                            :defaultValue="item.birthday"
                          />
                        </template>
                      </van-field>
                    </div>
                    <van-icon name="arrow" class="c-8moxqg-item-left" />
                  </div>
                </div>

                <div class="c-91t2s9-list-item">
                  <div class="c-8moxqg flex-row flex-align-center">
                    <span class="c-8moxqg-item-star">*</span>
                    <div class="c-8moxqg-item-label">证件是否长期有效</div>
                    <div class="c-8moxqg-item-value c-8moxqg-item-margin-left">
                      <van-radio-group
                        class="c-8moxqg-item-value-text"
                        v-model="item.isIdLongTerm"
                        direction="horizontal"
                      >
                        <van-radio name="Y">是</van-radio>
                        <van-radio name="N">否</van-radio>
                      </van-radio-group>
                    </div>
                  </div>
                </div>

                <div
                  class="c-91t2s9-list-item"
                  v-if="item.isIdLongTerm === 'N'"
                >
                  <div class="c-8moxqg flex-row flex-align-center">
                    <div class="c-8moxqg-item-label">证件有效期止期</div>
                    <div class="c-8moxqg-item-value">
                      <van-field
                        class="c-8moxqg-item-value-text"
                        :value="item.idEndDate"
                        name="idEndDate"
                        @click="handleVisible('idEndDateTyp' + index, 0)"
                        :rules="formRules.idEndDateTypeRules"
                      >
                        <template #input>
                          <PeoBirthday
                            :ref="'idEndDateTyp' + index"
                            title="选择年月日"
                            @confirm="
                              value =>
                                handleConfirm(
                                  value,
                                  'idEndDate',
                                  'appPolicyInsuredList',
                                  index
                                )
                            "
                            placeholder="请输入证件有效期止期	"
                            :defaultValue="item.idEndDate"
                          />
                        </template>
                      </van-field>
                    </div>
                    <van-icon name="arrow" class="c-8moxqg-item-left" />
                  </div>
                </div>

                <div class="c-91t2s9-list-item">
                  <div class="c-8moxqg flex-row flex-align-center">
                    <span class="c-8moxqg-item-star">*</span>
                    <div class="c-8moxqg-item-label">手机号码</div>
                    <div class="c-8moxqg-item-value">
                      <van-field
                        class="c-8moxqg-item-value-text"
                        v-model="item.mobile"
                        name="mobile"
                        placeholder="请输入手机号"
                        :rules="formRules.mobileRules"
                      ></van-field>
                    </div>
                  </div>
                </div>
                <div class="c-91t2s9-list-item">
                  <div class="c-8moxqg flex-row flex-align-center">
                    <span class="c-8moxqg-item-star">*</span>
                    <div class="c-8moxqg-item-label">电子邮箱</div>
                    <div class="c-8moxqg-item-value">
                      <van-field
                        class="c-8moxqg-item-value-text"
                        v-model="item.email"
                        name="email"
                        :rules="formRules.emailRules"
                      ></van-field>
                    </div>
                  </div>
                </div>

                <!-- 国籍 -->
                <div class="c-91t2s9-list-item">
                  <div class="c-8moxqg flex-row flex-align-center">
                    <div class="c-8moxqg-item-label">国籍</div>
                    <div class="c-8moxqg-item-value">
                      <van-field
                        class="c-8moxqg-item-value-text"
                        :value="item.nationalityCode"
                        name="nationalityCode"
                        :rules="formRules.nationRules"
                        @click="handleVisible('nation' + index, 0)"
                      >
                        <template #input>
                          <PeoInsured
                            :ref="'nation' + index"
                            title="国籍"
                            @confirm="
                              value =>
                                handleConfirm(
                                  value,
                                  'nationalityCode',
                                  'appPolicyInsuredList',
                                  index
                                )
                            "
                            placeholder="请输入国籍"
                            :defaultValue="item.nationalityCode"
                            :columns="nationList"
                          />
                        </template>
                      </van-field>
                    </div>
                    <van-icon name="arrow" class="c-8moxqg-item-left" />
                  </div>
                </div>

                <!-- 所在地区 -->
                <div class="c-91t2s9-list-item">
                  <div class="c-8moxqg flex-row flex-align-center">
                    <div class="c-8moxqg-item-label">所在地区</div>
                    <div class="c-8moxqg-item-value">
                      <van-field
                        class="c-8moxqg-item-value-text"
                        name="area"
                        @click="handleVisible('areaInsured' + index, 0)"
                      >
                        <template #input>
                          <PeoArea
                            :ref="'areaInsured' + index"
                            @confirm="
                              value =>
                                handleConfirm(
                                  value,
                                  'area',
                                  'appPolicyInsuredList',
                                  index
                                )
                            "
                            placeholder="请选择所在地区"
                            :areaList="areaList"
                            :defaultValue="item.area"
                            :value="item.area"
                          />
                        </template>
                      </van-field>
                    </div>
                    <van-icon name="arrow" class="c-8moxqg-item-left" />
                  </div>
                </div>
                <div class="c-91t2s9-list-item">
                  <div class="c-8moxqg flex-row flex-align-center">
                    <div class="c-8moxqg-item-label">详细地区</div>
                    <div class="c-8moxqg-item-value">
                      <van-field
                        type="textarea"
                        rows="1"
                        autosize
                        class="c-8moxqg-item-value-text"
                        v-model="item.street"
                        name="street"
                        placeholder="例：学院路37号1号楼109室"
                      ></van-field>
                    </div>
                  </div>
                </div>

                <div class="c-91t2s9-list-item">
                  <div class="c-8moxqg flex-row flex-align-center">
                    <div class="c-8moxqg-item-label">邮政编码</div>
                    <div class="c-8moxqg-item-value">
                      <van-field
                        class="c-8moxqg-item-value-text"
                        v-model="item.zipCode"
                        name="zipCode"
                        placeholder="请输入邮政编码"
                      ></van-field>
                    </div>
                  </div>
                </div>
              </div>
              <!-- 婚姻状况 -->
              <div class="c-91t2s9-list-item">
                <div class="c-8moxqg flex-row flex-align-center">
                  <div class="c-8moxqg-item-label">婚姻状况</div>
                  <div class="c-8moxqg-item-value">
                    <van-field
                      class="c-8moxqg-item-value-text"
                      :value="item.marriageType"
                      name="marriageType"
                      :rules="formRules.marriageTypeRules"
                      @click="handleVisible('marriageType', index)"
                    >
                      <template #input>
                        <PeoInsured
                          ref="marriageType"
                          title="婚姻状况"
                          inputType="card"
                          @confirm="
                            value =>
                              handleConfirm(
                                value,
                                'marriageType',
                                'appPolicyInsuredList',
                                index
                              )
                          "
                          placeholder="请选择婚姻状况"
                          :defaultValue="item.marriageType"
                          :columns="maryList"
                        />
                      </template>
                    </van-field>
                  </div>
                  <van-icon name="arrow" class="c-8moxqg-item-left" />
                </div>
              </div>
              <!-- 身高 -->
              <div class="c-91t2s9-list-item">
                <div class="c-8moxqg flex-row flex-align-center">
                  <div class="c-8moxqg-item-label">身高(cm)</div>
                  <div class="c-8moxqg-item-value">
                    <van-field
                      class="c-8moxqg-item-value-text"
                      v-model="item.height"
                      type="number"
                      name="height"
                      :rules="formRules.heightRules"
                      placeholder="请输入身高"
                    ></van-field>
                  </div>
                </div>
              </div>
              <!-- 体重 -->
              <div class="c-91t2s9-list-item">
                <div class="c-8moxqg flex-row flex-align-center">
                  <div class="c-8moxqg-item-label">体重(kg)</div>
                  <div class="c-8moxqg-item-value">
                    <van-field
                      class="c-8moxqg-item-value-text"
                      v-model="item.weight"
                      type="number"
                      name="weight"
                      :rules="formRules.weightRules"
                      placeholder="请输入体重"
                    ></van-field>
                  </div>
                </div>
              </div>
              <!-- 平均年收入 -->
              <div class="c-91t2s9-list-item">
                <div class="c-8moxqg flex-row flex-align-center">
                  <div class="c-8moxqg-item-label">平均年收入</div>
                  <div class="c-8moxqg-item-value">
                    <van-field
                      class="c-8moxqg-item-value-text"
                      v-model="item.annualIncome"
                      type="number"
                      name="weight"
                      placeholder="请输入平均年收入"
                    ></van-field>
                  </div>
                </div>
              </div>
              <!-- 是否有社保 -->
              <div class="c-91t2s9-list-item">
                <div class="c-8moxqg flex-row flex-align-center">
                  <div class="c-8moxqg-item-label">是否有社保</div>
                  <div class="c-8moxqg-item-value c-8moxqg-item-margin-left">
                    <van-radio-group
                      class="c-8moxqg-item-value-text"
                      v-model="item.isSocialSecurity"
                      direction="horizontal"
                    >
                      <van-radio name="Y">是</van-radio>
                      <van-radio name="N">否</van-radio>
                    </van-radio-group>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <!-- 受益人 -->
          <div class="c-91t2s9">
            <div
              class="c-91t2s9-title flex-row flex-align-center flex-justify-between"
            >
              <div>受益人信息</div>
              <div
                v-show="onlyLegal"
                class="c-91t2s9-title-plus flex-row flex-align-center"
                @click="addBeneficiary()"
              >
                <van-icon name="plus" />
                <span>新增</span>
              </div>
            </div>
            <div
              class="c-91t2s9-list"
              v-for="(item, index) in appPolicyBeneficiaryList"
              :key="index"
            >
              <div class="c-91t2s9-list-title">
                <div
                  class="c-91t2s9-list-del flex-row flex-align-center"
                  @click="delList(index, appPolicyBeneficiaryList)"
                >
                  <span>删除</span>
                  <van-icon name="delete-o" />
                </div>
              </div>
              <div class="c-91t2s9-list-item">
                <div class="c-8moxqg flex-row flex-align-center">
                  <span class="c-8moxqg-item-star">*</span>
                  <div class="c-8moxqg-item-label">受益人类型</div>
                  <div class="c-8moxqg-item-value">
                    <van-field
                      class="c-8moxqg-item-value-text"
                      :value="item.isLegalBeneficiary"
                      name="isLegalBeneficiary"
                      @click="handleVisible('peopleType', index)"
                      :rules="formRules.peopleTypeRules"
                    >
                      <template #input>
                        <PeoInsured
                          ref="peopleType"
                          title="受益人类型"
                          @confirm="
                            value =>
                              handleConfirm(
                                value,
                                'isLegalBeneficiary',
                                'appPolicyBeneficiaryList',
                                index
                              )
                          "
                          placeholder="受益人类型"
                          :defaultValue="item.isLegalBeneficiary"
                          :columns="peopleTypeList"
                        />
                      </template>
                    </van-field>
                  </div>
                  <van-icon name="arrow" class="c-8moxqg-item-left" />
                </div>
              </div>
              <!-- 受益人为指定是需要录入信息，为法定时不用录入   v-if="item.isLegalBeneficiary === 'N'"-->
              <div v-if="item.isLegalBeneficiary === 'N'">
                <!-- 与被保人关系 -->
                <div class="c-91t2s9-list-item">
                  <div class="c-8moxqg flex-row flex-align-center">
                    <span class="c-8moxqg-item-star">*</span>
                    <div class="c-8moxqg-item-label">与被保人关系</div>
                    <div class="c-8moxqg-item-value">
                      <van-field
                        class="c-8moxqg-item-value-text"
                        :value="item.relationType"
                        name="relationType"
                        @click="handleVisible('berelationType' + index, 0)"
                        :rules="formRules.relationTypeRules2"
                      >
                        <template #input>
                          <PeoInsured
                            :ref="'berelationType' + index"
                            title="与被保人关系"
                            @confirm="
                              value =>
                                handleConfirm(
                                  value,
                                  'relationType',
                                  'appPolicyBeneficiaryList',
                                  index
                                )
                            "
                            placeholder="与被保险人的关系"
                            :defaultValue="item.relationType"
                            :columns="relationList"
                          />
                        </template>
                      </van-field>
                    </div>
                    <van-icon name="arrow" class="c-8moxqg-item-left" />
                  </div>
                </div>
                <!-- v-if="item.relationType !== '00'" -->
                <div>
                  <div class="c-91t2s9-list-item">
                    <div class="c-8moxqg flex-row flex-align-center">
                      <span class="c-8moxqg-item-star">*</span>
                      <div class="c-8moxqg-item-label">姓名</div>
                      <div class="c-8moxqg-item-value">
                        <van-field
                          class="c-8moxqg-item-value-text"
                          v-model="item.name"
                          name="name"
                          :rules="formRules.nameRules"
                        ></van-field>
                      </div>
                      <img
                        class="c-8moxqg-item-img"
                        src="./img/doc.png"
                        @click="
                          handleVisible('beneficiaryInfoName' + index, 0)
                          $refs['beneficiaryInfoName' + index][0].value =
                            item.name
                        "
                      />
                      <PeoList
                        :ref="'beneficiaryInfoName' + index"
                        @confirm="
                          value =>
                            handlePeopleSelect(
                              value,
                              appPolicyBeneficiaryList,
                              index
                            )
                        "
                        :columns="peopleList"
                      />
                    </div>
                  </div>

                  <div class="c-91t2s9-list-item">
                    <div class="c-8moxqg flex-row flex-align-center">
                      <span class="c-8moxqg-item-star">*</span>
                      <div class="c-8moxqg-item-label">证件类型</div>
                      <div class="c-8moxqg-item-value">
                        <van-field
                          class="c-8moxqg-item-value-text"
                          :value="item.idType"
                          name="idType"
                          @click="
                            handleVisible('beneficiaryInfoidType' + index, 0)
                          "
                          :rules="
                            appPolicyHolderInfo.idType == 1
                              ? formRules.cardTypeRules
                              : formRules.noEmptyRules
                          "
                        >
                          <template #input>
                            <PeoInsured
                              :ref="'beneficiaryInfoidType' + index"
                              title="证件类型"
                              @confirm="
                                value =>
                                  handleConfirm(
                                    value,
                                    'idType',
                                    'appPolicyBeneficiaryList',
                                    index
                                  )
                              "
                              placeholder="请选择证件类型"
                              :defaultValue="item.idType"
                              :columns="cardList"
                            />
                          </template>
                        </van-field>
                      </div>
                      <van-icon name="arrow" class="c-8moxqg-item-left" />
                    </div>
                  </div>
                  <div class="c-91t2s9-list-item">
                    <div class="c-8moxqg flex-row flex-align-center">
                      <span class="c-8moxqg-item-star">*</span>
                      <div class="c-8moxqg-item-label">证件号码</div>
                      <div class="c-8moxqg-item-value">
                        <van-field
                          class="c-8moxqg-item-value-text"
                          v-model="item.idNo"
                          name="idNo"
                          :rules="formRules.cardNoeRules"
                        ></van-field>
                      </div>
                      <div
                        class="flex-row flex-align-center"
                        @click="
                          handleGoToScan(
                            'card',
                            'idNo',
                            PEOPLE_TYPE.POLICT_INSURED,
                            'appPolicyBeneficiaryList',
                            index
                          )
                        "
                      >
                        <van-icon class="c-8moxqg-item-scan" name="scan" />
                        <span class="c-8moxqg-item-img-text">扫描</span>
                      </div>
                    </div>
                  </div>

                  <div class="c-91t2s9-list-item">
                    <div class="c-8moxqg flex-row flex-align-center">
                      <div class="c-8moxqg-item-label">证件是否长期有效</div>
                      <div
                        class="c-8moxqg-item-value c-8moxqg-item-margin-left"
                      >
                        <van-radio-group
                          class="c-8moxqg-item-value-text"
                          v-model="item.isIdLongTerm"
                          direction="horizontal"
                        >
                          <van-radio name="Y">是</van-radio>
                          <van-radio name="N">否</van-radio>
                        </van-radio-group>
                      </div>
                    </div>
                  </div>
                  <div
                    class="c-91t2s9-list-item"
                    v-if="item.isIdLongTerm === 'N'"
                  >
                    <div class="c-8moxqg flex-row flex-align-center">
                      <div class="c-8moxqg-item-label">证件有效期止期</div>
                      <div class="c-8moxqg-item-value">
                        <van-field
                          class="c-8moxqg-item-value-text"
                          :value="item.idEndDate"
                          name="idEndDate"
                          @click="
                            handleVisible(
                              'beneficiaryInfoidEndDateType' + index,
                              0
                            )
                          "
                          :rules="formRules.idEndDateTypeRules"
                        >
                          <template #input>
                            <PeoBirthday
                              :ref="'beneficiaryInfoidEndDateType' + index"
                              title="选择年月日"
                              @confirm="
                                value =>
                                  handleConfirm(
                                    value,
                                    'idEndDate',
                                    'appPolicyBeneficiaryList',
                                    index
                                  )
                              "
                              placeholder="请输入证件有效期止期	"
                              :defaultValue="item.idEndDate"
                            />
                          </template>
                        </van-field>
                      </div>
                      <van-icon name="arrow" class="c-8moxqg-item-left" />
                    </div>
                  </div>
                  <!-- 受益人顺序 -->
                  <div class="c-91t2s9-list-item">
                    <div class="c-8moxqg flex-row flex-align-center">
                      <div class="c-8moxqg-item-label">受益人顺序</div>
                      <div class="c-8moxqg-item-value">
                        <van-field
                          class="c-8moxqg-item-value-text"
                          v-model="item.beneficialOrder"
                          name="beneficialOrder"
                          type="digit"
                          placeholder="请输入受益人顺序"
                        ></van-field>
                      </div>
                    </div>
                  </div>
                  <!-- 受益人比列 -->
                  <div class="c-91t2s9-list-item">
                    <div class="c-8moxqg flex-row flex-align-center">
                      <div class="c-8moxqg-item-label">受益人比列</div>
                      <div class="c-8moxqg-item-value">
                        <van-field
                          class="c-8moxqg-item-value-text"
                          v-model="item.beneficialRatio"
                          type="digit"
                          name="beneficialRatio"
                          placeholder="请输入受益人比列"
                        ></van-field>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <!-- 底部 -->
          <div class="c-hi306n-bottom" @click="handleNext">下一步</div>
        </div>
      </van-form>
    </Loading>
  </div>
</template>
<script>
import PeoInsured from '@/components/peoInsured'
import PeoList from '@/components/peoList'
import PeoBirthday from '@/components/peoBirthday'
import Loading from '@/components/data-loading'
import PeoArea from '@/components/popArea'
import comAPI from '@/services/h5/common'
import API from '@/services/h5/product'
import { getBirth, getSex } from '@/utils/public/ch-idNo.js'
// import { PEOPLE_TYPE } from '@/config/h5/index.js'
import { mapState, mapGetters, mapMutations } from 'vuex'
export default {
  components: { PeoInsured, PeoList, PeoBirthday, PeoArea, Loading },
  data() {
    return {
      peoShow: false,
      peopleList: [],
      cardList: [],
      bankList: [],
      sexList: [],
      nationList: [],
      relationList: [],
      maryList: [],
      //   受益人
      peopleTypeList: [], // 受益人类型
      areaList: {
        city_list: {},
        county_list: {},
        province_list: {}
      }
    }
  },
  computed: {
    ...mapState('loading', ['loading']),
    ...mapState('product', [
      'PEOPLE_TYPE',
      'appPolicyHolderInfo',
      'appPolicyInsuredList',
      'appPolicyBeneficiaryList',
      'contractId',
      'ids'
    ]),
    ...mapGetters('product', ['productInfo', 'formRules']),
    onlyLegal() {
      const data = this.appPolicyBeneficiaryList.find(
        item => item.isLegalBeneficiary === 'Y'
      )
      if (data) {
        return false
      } else {
        return true
      }
    }
  },
  mounted() {
    this.init()
  },
  methods: {
    ...mapMutations('loading', ['setLoading']),
    ...mapMutations('product', [
      'setField',
      'setArrayField',
      'addArrayBeneficiary',
      'addArrayPolicyInsured',
      'setContractId'
    ]),
    checkappPolicyHolderInfoIdNO(value) {
      let reg = /^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[X])$)$/
      if (value && reg.test(value) && this.appPolicyHolderInfo.idType == 1) {
        // this.appPolicyHolderInfo.birthday = getBirth(value)
        // this.appPolicyHolderInfo.sex = getSex(value)
        this.setField(['birthday', getBirth(value)])
        this.setField(['sex', getSex(value)])
      }
    },
    checkappPolicyInsuredListIdNO(value, index) {
      let reg = /^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[X])$)$/
      if (
        value &&
        reg.test(value) &&
        this.appPolicyInsuredList[index].idType == 1
      ) {
        this.setArrayField([
          getBirth(value),
          'birthday',
          'appPolicyInsuredList',
          index
        ])
        this.setArrayField([
          getSex(value),
          'sex',
          'appPolicyInsuredList',
          index
        ])
      }
    },
    async init() {
      this.setLoading(true)
      // 获取所需要的字典值，性别/证件类型/银行卡类型/国籍/与投保人的关系/婚姻状况
      let res = await Promise.all([
        comAPI.getDictList({
          codeType: 'sex'
        }),
        comAPI.getDictList({
          codeType: 'idType'
        }),
        comAPI.getBankList(),
        comAPI.getDictList({
          codeType: 'nationalityCode'
        }),
        comAPI.getDictList({
          codeType: 'relationType'
        }),
        comAPI.getDictList({
          codeType: 'maritalStatus'
        }),
        comAPI.getDictList({
          codeType: 'isLegalBeneficiary'
        })
      ])
      this.sexList = res[0].data.data
      this.cardList = res[1].data.data
      this.bankList = []
      res[2].data.data.map(item => {
        this.bankList.push({
          code: item.bankId,
          codeName: item.bankName
        })
      })
      this.nationList = res[3].data.data
      this.relationList = res[4].data.data
      this.maryList = res[5].data.data
      this.peopleTypeList = res[6].data.data

      let [provice, city, country] = await Promise.all([
        comAPI.getAreaList('01'),
        comAPI.getAreaList('02'),
        comAPI.getAreaList('03')
      ])
      this.areaList = {
        city_list: this.getAreaData(city),
        county_list: this.getAreaData(country),
        province_list: this.getAreaData(provice)
      }
      let customer = await API.getCustomerList()
      if (customer.data && customer.data.code === 1000) {
        this.peopleList = []
        customer.data.data.list.forEach(item => {
          this.peopleList.push({
            label: item.name,
            value: item.idNo,
            ...item
          })
        })
      }
      this.setLoading(false)
    },
    getAreaData(res) {
      if (res.data && res.data.code === 1000) {
        let data = res.data.data
        let obj = {}
        data.forEach(item => {
          obj[item.placeCode] = item.placeName
        })
        return obj
      }
    },
    // 保存数据
    handleNext() {
      let productId = this.productInfo.productId
      let policyBeneficiaries = []
      const data = this.appPolicyBeneficiaryList.find(
        item => item.isLegalBeneficiary === 'Y'
      )
      if (data) {
        policyBeneficiaries = this.appPolicyBeneficiaryList.filter(
          item => item.isLegalBeneficiary === 'Y'
        )
      } else {
        policyBeneficiaries = this.appPolicyBeneficiaryList.map(
          ({
            beneficialOrder,
            beneficialRatio,
            id,
            idEndDate,
            idNo,
            idType,
            isIdLongTerm,
            isLegalBeneficiary,
            name,
            relationType
          }) => {
            return {
              beneficialOrder,
              beneficialRatio,
              id,
              idEndDate: isIdLongTerm === 'N' ? idEndDate : '',
              idNo,
              idType,
              isIdLongTerm,
              isLegalBeneficiary,
              name,
              relationType
            }
          }
        )
      }
      let params = {
        policyHolder: {
          bankId: this.appPolicyHolderInfo.bankId,
          birthday: this.appPolicyHolderInfo.birthday,
          branchBankName: this.appPolicyHolderInfo.branchBankName,
          cardNo: this.appPolicyHolderInfo.cardNo,
          city: this.appPolicyHolderInfo.city,
          country: this.appPolicyHolderInfo.country,
          email: this.appPolicyHolderInfo.email,
          id: this.appPolicyHolderInfo.id,
          idEndDate:
            this.appPolicyHolderInfo.isIdLongTerm === 'N'
              ? this.appPolicyHolderInfo.idEndDate
              : '',
          idNo: this.appPolicyHolderInfo.idNo,
          idType: this.appPolicyHolderInfo.idType,
          isIdLongTerm: this.appPolicyHolderInfo.isIdLongTerm,
          mobile: this.appPolicyHolderInfo.mobile,
          name: this.appPolicyHolderInfo.name,
          province: this.appPolicyHolderInfo.province,
          sex: this.appPolicyHolderInfo.sex,
          street: this.appPolicyHolderInfo.street
        },
        policyInsureds: this.appPolicyInsuredList.map(
          ({
            annualIncome,
            birthday,
            city,
            country,
            email,
            height,
            id,
            idEndDate,
            idNo,
            idType,
            isIdLongTerm,
            isSocialSecurity,
            marriageType,
            mobile,
            name,
            nationalityCode,
            province,
            relationType,
            sex,
            street,
            weight,
            zipCode
          }) => {
            return {
              annualIncome,
              birthday,
              city,
              country,
              email,
              height,
              id,
              idEndDate: isIdLongTerm === 'N' ? idEndDate : '',
              idNo,
              idType,
              isIdLongTerm,
              isSocialSecurity,
              marriageType,
              mobile,
              name,
              nationalityCode,
              province,
              relationType,
              sex,
              street,
              weight,
              zipCode
            }
          }
        ),
        policyBeneficiaries: policyBeneficiaries,
        contractId: this.contractId,
        ids: this.ids,
        productId: productId
      }
      console.log('ddddd=====>', params)

      this.$refs.userInfoForm
        .validate()
        .then(async () => {
          this.setLoading(true)
          let res = await API.saveCustomer(params)
          if (res.data && res.data.code === 1000) {
            this.setContractId(res.data.data)
            let path = `/productOffline/insuranceOption?contractId=${res.data.data}`
            this.$router.replace({
              path: path
            })
            this.setLoading(false)
          }
        })
        .catch(err => {
          console.log(err)
        })
    },
    // 扫描
    handleGoToScan(type, prop, peopleType, data, index) {
      // let path = `/productOffline/${this.$route.query.productId}/scan`
      let path = '/scan'
      this.$router.push({
        path,
        query: {
          type: type,
          prop: prop,
          peopleType: peopleType,
          data,
          index
        }
      })
    },
    handleVisible(type, index) {
      // console.log('ddddddd', type, index, this.$refs[type])
      if (index !== undefined) {
        this.$refs[type][index].visible = true
      } else {
        this.$refs[type].visible = true
      }
    },
    // 各个类型的选择
    handleConfirm(value, prop, data, index) {
      let flag = index !== undefined
      if (flag) {
        this.setArrayField([value, prop, data, index])
        if (prop === 'area') {
          this.setArrayField([value[0], 'province', data, index])
          this.setArrayField([value[1], 'city', data, index])
          this.setArrayField([value[2], 'country', data, index])
        }
        // if (prop === 'relationType') {
        //   this.setRelationTypeData(value, data, index)
        // }
      } else {
        this[data][prop] = value
        if (prop === 'area') {
          this.setField(['province', value[0]])
          this.setField(['city', value[1]])
          this.setField(['country', value[2]])
        }
      }
    },
    // 判断relationType填写数据
    setRelationTypeData(value, data, index) {
      if (
        data === 'appPolicyInsuredList' &&
        this.appPolicyHolderInfo.name !== '' &&
        value === '00'
      ) {
        for (let i in this[data][index]) {
          this.appPolicyHolderInfo[i] !== undefined &&
            this.setArrayField([this.appPolicyHolderInfo[i], i, data, index])
        }
      }
    },
    // 投保人、被保险人和受益人的选择
    handlePeopleSelect(value, data, index) {
      let flag = Object.prototype.toString.call(data) == '[object Array]'
      if (flag) {
        for (let i in data[index]) {
          value[i] !== undefined && (data[index][i] = value[i])

          if (i === 'area' && value.province !== '') {
            data[index][i] = [value.province, value.city, value.country]
          }
        }
      } else {
        for (let i in this[data]) {
          value[i] !== undefined && (this[data][i] = value[i])
          if (i === 'area' && value.province !== '') {
            this[data][i] = [value.province, value.city, value.country]
          }
        }
      }
    },
    // 新增受益人
    addBeneficiary() {
      let obj = {
        id: '',
        isLegalBeneficiary: '',
        relationType: '', // 与被保险人的关系
        name: '', // 姓名
        idType: '', // 证件类型
        idNo: '',
        isIdLongTerm: 'Y', //证件是否长期有效,可用值:Y/N
        idEndDate: '', //证件有效期止期
        beneficialOrder: '', // 受益人顺序
        beneficialRatio: '' // 受益人比列
      }
      this.addArrayBeneficiary(obj)
    },
    // 新增被保险人
    addPolicyInsuredInfo() {
      let obj = {
        id: '',
        relationType: '', // 是投保人的
        idType: '', //证件类型
        name: '',
        idNo: '',
        sex: '',
        birthday: '',
        isIdLongTerm: 'Y', //证件是否长期有效,可用值:Y/N
        idEndDate: '', // 证件有效期止期
        nationalityCode: '156', //国籍
        height: '',
        weight: '',
        marriageType: '',
        zipCode: '',
        area: [],
        street: '',
        annualIncome: '',
        isSocialSecurity: 'Y', //是否有社保,可用值:Y/N
        mobile: '',
        email: ''
      }
      this.addArrayPolicyInsured(obj)
    },
    // 删除
    delList(index, data) {
      if (data.length > 1) {
        this.$dialog
          .alert({
            message: '是否确认删除该人?',
            showCancelButton: true
          })
          .then(() => {
            data.splice(index, 1)
          })
          .catch(() => {})
      } else {
        this.$message.warning('不可删除')
      }
    }
  }
}
</script>
<style lang="less" scoped src="./index.less"></style>
